<template>
    <view style="height: 100%">
        <view class="content">
            <view class="settlement-box" @click="onPage('order?type=1')">
                <view class="settlement-left">
                    <view class="settlement-title">待结算金额(元)</view>
                    <view class="settlement-num">{{ ucredit }}</view>
                </view>
                <image src="/static/icon-right.png" class="icon-right"></image>
            </view>
            <view class="settlement-box" @click="onPage('order?type=2')">
                <view class="settlement-left">
                    <view class="settlement-title">可提现金额(元）</view>
                    <view class="settlement-num">{{ credit }}</view>
                </view>
				<block v-if="credit > 0 && credit >= min">
					<view class="withdrawal-btn" @click="onWith">提现</view>
					<view class="withdrawal-btn" style="margin-left: 20rpx;font-size: 26rpx;background: #2A89F8;" @click="onSet">收款设置</view>
				</block>
				<image src="/static/icon-right.png" class="icon-right" v-else></image>
            </view>
            <view class="settlement-box" @click="onPage('with')">
                <view class="withdrawal-left">
                    <image src="/static/icon-money.png" class="icon-money"></image>
                    <text>提现记录</text>
                </view>
                <image src="/static/icon-right.png" class="icon-right"></image>
            </view>
        </view>
        <view class="withdrawal-explain" v-if='rule'>
            <view class="explain-title">提现说明</view>
            <view class='explain-txt'>{{rule}}</view>
        </view>
		
		<uv-modal ref='popup' title="收款设置" zIndex='99' :showCancelButton='true' confirmText="保存" @confirm="onSetSave">
			<uv-form labelPosition="left" ref="form" style="width: 100%;">
				<uv-form-item labelWidth='90px' label="支付宝名字" prop="title" ref="item1">
					<uv-input type="text" maxlength="6" v-model="info.name"></uv-input>
				</uv-form-item>
				<uv-form-item labelWidth='90px' label="支付宝账号" prop="title" ref="item1">
					<uv-input type="text" v-model="info.account"></uv-input>
				</uv-form-item>
			</uv-form>		
		</uv-modal>
		<view class='backbtn' @click="onBack">返回</view>
    </view>
</template>

<script>
var app = getApp();
export default {
    data() {
        return {
            credit: '*',
            ucredit: '*',
            min: 0,
            rule: '',
			info:{},
        };
    },
    onLoad: function (options) {
		var t = this;
		this.util.post('agent/with',{},(r)=>{
			t.credit = r.credit;
			t.ucredit = r.ucredit;
			t.min = r.min;
			t.rule = r.rule;
			if(r.info) t.info = r.info;
		})
	},
    methods: {
		onBack(){
			uni.navigateBack()
		},
		onPage(page){
			var url = '';
			if(page == 'with') url = "log?type=with";
			else url = page;
			uni.navigateTo({
				url:'/pages/agent/'+url
			})
		},
        onWith() {
			var t = this;
			if(!this.info.name || this.info.name == ''){
				return uni.showModal({
                            title: '温馨提示',
                            content: '请先设置收款信息',
                            showCancel: false,
                            success() {
                                t.onSet();
                            }
                        });
			}
			uni.showModal({
				title: '温馨提示',
				content: '确定申请提现吗？',
				success(r) {
					if(!r.confirm) return;
					t.util.post('agent/with/save',{},function (res) {
						if (res.code == 1) {
							uni.showModal({
								title: '申请成功',
								content: '申请提现成功，请耐心等候审核发放',
								showCancel: false,
								success() {
									uni.navigateBack();
								}
							});
						} else {
							uni.showModal({
								title: '申请失败',
								content: res.msg,
								showCancel: false,
							});
						}
						}
					);
				}
			});
        },
		onSet(){
			this.$refs.popup.open();
		},
		onSetSave(){
			if(!this.info.name || this.info.name == '') return this.util.showMsg('请输入支付宝名字')
			if(!this.info.account || this.info.account == '') return this.util.showMsg('请输入支付宝账号')
			var t = this;
			this.util.post('agent/with/save',{op:'info',name:this.info.name,account:this.info.account},function (res) {
				if (res.code == 1) {
					uni.showToast({
						title:'设置成功'
					})
				} else {
					uni.showModal({
						title: '设置失败',
						content: res.msg,
						showCancel: false,
					});
				}
			});
		}
    }
};
</script>
<style>
page {
    background-color: #ffffff;
}

.content {
	padding: 30rpx;
}

.settlement-box {
    background: #ffffff;
    box-shadow: 0 2px 15px 0 rgba(215, 215, 215, 0.5);
    border-radius: 16rpx;
    margin-top: 30rpx;
    display: flex;
    align-items: center;
    padding: 30rpx;
}

.settlement-title {
    font-size: 28rpx;
    color: #999999;
    line-height: 34rpx;
}

.settlement-num {
    font-size: 52rpx;
    color: #333333;
    font-weight: 600;
    line-height: 66rpx;
}
.settlement-tips {
    color: red;
    font-size: 24rpx;
}
.icon-right {
    margin-left: auto;
    width: 18rpx;
    height: 24rpx;
}

.withdrawal-btn {
    background-image: linear-gradient(256deg, #ff8c63 0%, #ff1c1c 100%);
    border-radius: 32rpx;
    width: 142rpx;
    height: 64rpx;
    color: #ffffff;
    font-size: 28rpx;
    margin-left: auto;
    line-height: 64rpx;
    text-align: center;
}

.withdrawal-left {
    display: flex;
    align-items: center;
    font-size: 30rpx;
    color: #333333;
}

.icon-money {
    width: 32rpx;
    height: 32rpx;
    margin-right: 12rpx;
}

.withdrawal-intor {
    margin-top: 60rpx;
}

.withdrawal-title {
    font-size: 24rpx;
    color: #121834;
    line-height: 34rpx;
    padding-bottom: 20rpx;
}

.withdrawal-line {
    font-size: 24rpx;
    color: #999999;
    line-height: 40rpx;
}

.withdrawal-explain {
    padding: 0 30rpx;
    margin-top: 55rpx;
}

.explain-title {
    font-size: 30rpx;
    color: #121834;
    line-height: 34rpx;
    margin-bottom: 10rpx;
}

.explain-txt {
	margin-top: 10rpx;
    font-size: 28rpx;
    color: #999999;
	white-space: pre-wrap;
}
</style>
